<template>
<div>
  <Button type="primary" size="small" @click="clickModel">常住地变更历史</Button>
  <Modal
    width="1200"
    v-model="modal"
    title="人员常住地变成历史记录">
    <div class="divtitleClass">
      人员常住地变成历史记录
    </div>
    <vxe-table
      v-if="modal"
      align="center"
      :data="tableData">
<!--      <vxe-table-column width="15%" field="first_level_label" title="变更前区"></vxe-table-column>-->
<!--      <vxe-table-column width="15%" field="second_level_label" title="变更前街道"></vxe-table-column>-->
<!--      <vxe-table-column width="20%" field="second_level_label" title="变更前社区"></vxe-table-column>-->
<!--      <vxe-table-column width="15%" field="first_level_label" title="变更后区"></vxe-table-column>-->
<!--      <vxe-table-column width="15%" field="second_level_label" title="变更后街道"></vxe-table-column>-->
<!--      <vxe-table-column width="20%" field="second_level_label" title="变更后社区"></vxe-table-column>-->
      <vxe-table-column width="40%" field="old_company_name" title="变更前社区"></vxe-table-column>
      <vxe-table-column width="40%" field="new_company_name" title="变更后社区"></vxe-table-column>
      <vxe-table-column width="20%" field="create_time" title="变更时间"></vxe-table-column>
    </vxe-table>
  </Modal>
</div>
</template>

<script>
import { findUserTypeLogList } from '../../../../api/eventlist'

export default {
  name: 'userTypeLog',
  props: {
    userInfo: {
      type: Object
    }
  },
  data () {
    return {
      modal: false,
      tableData: []
    }
  },
  methods: {
    clickModel () {
      let data = {
        cardno: this.userInfo.cardno
      }
      findUserTypeLogList(data).then(ret => {
        if (ret.data.errcode === 0) {
          this.tableData = ret.data.data
          this.modal = true
        } else {
          this.$Notice.error({ title: '失败', desc: ret.data.errmsg })
        }
      })
    }
  }
}
</script>

<style scoped>
.selectCss{
  display: flex;
  margin-bottom: 10px;
}
.divclass{
  margin-bottom: 10px;
}
.divtitleClass{
  background-color: rgb(236, 248, 255);
  border-left: 5px solid rgb(80, 191, 255);
  border-radius: 4px;
  font-size: 16px;
  margin: 15px 0px;
  padding: 8px 12px;
  width: 100%;
}
.topclass{
  margin-right: 5px;
}
</style>
